<template>
  <!-- 子给父传递数据 -->
  <div id="app" class="app">
    <h1>{{ msg }}</h1>
    <School></School>
    <Student></Student>
    <hr />
  </div>
</template>

<script>
// 引入的顺序，后面的样式会把前面同名的样式覆盖掉
import Student from "./components/Student.vue";
import School from "./components/School.vue";

export default {
  name: "App",
  components: {
    Student,
    School,
  },
  methods: {},
  data() {
    return {
      msg: "hello vue",
    };
  },
  mounted() {},
};
</script>

<style>
.app {
  text-align: center;
  font-size: 20px;
  color: #333;
  background-color: gray;
}
</style>
